<extend name="Public:base" />
<block name="Controller">Templates</block>
<block name="Main">
    <div class="col-md-10 main ">
        <h2>主题选择</h2>
        <hr />
        <ul class="md-block-grid-5">
            <li ms-repeat="temp" class="padding-right" >
            <div style="width:100%" class="thumbnail">
                <div class="thumbnail-caption">
                <img style="width:100%" ms-src="{{el.preview}}">
                <h3>{{el.title}}</h3>
                <p>{{el.desc}}</p>
                    <p>
                        <button class="btn btn-success btn-xs"><i class="icon-eye"></i>
                            预览</button>
                        <a ms-visible="el.tpl_name == appinfo.tpl " href="{:U('Admin/Styles/index')}" class="btn btn-warning btn-xs"><i class="icon-desktop"></i>
                            设计</a>
                        <button ms-visible="el.tpl_name != appinfo.tpl" ms-click="install(el)" class="btn btn-primary btn-xs"><i class="icon-download"></i>
                            安装</button>
                    </p>
                </div>
            </li>
        </ul>
    </div>
<load href="Public/easyapps/js/EasyApps.js" />
<script type="text/javascript">

require("nprogress/nprogress,jquery,app", function(nprogress,$,app) {
    var Templates = avalon.define('Templates', function(vm) {
        vm.temp = eval('({$temp})');
        vm.appinfo = eval('({$appinfo_json})');
        vm.install = function(el){
            nprogress.start();
            var theme = el.tpl_name;
            var url = "{:U('Admin/Templates/useTheme')}";
            $.post(url,{theme:theme},function(resq){
                vm.appinfo.tpl = el.tpl_name;
                nprogress.done();
            })
        }
    })
    avalon.scan()
}) 

</script> 
</block>